document.addEventListener('DOMContentLoaded', () => {
  const appIdInput = document.getElementById('appId');
  const appSecretInput = document.getElementById('appSecret');
  const groupByInput = document.getElementById('groupBy');
  const groupNameInput = document.getElementById('groupName');
  const dataIdInput = document.getElementById('dataId');
  const saveButton = document.getElementById('save');

  // Load saved settings
  chrome.storage.sync.get(['appId', 'appSecret', 'groupBy', 'groupName', 'dataId'], (result) => {
    appIdInput.value = result.appId || '';
    appSecretInput.value = result.appSecret || '';
    groupByInput.value = result.groupBy || '';
    groupNameInput.value = result.groupName || '';
    dataIdInput.value = result.dataId || '';

  });

  // Save settings
  saveButton.addEventListener('click', () => {
    const appId = appIdInput.value;
    const appSecret = appSecretInput.value;
    const groupBy = groupByInput.value;
    const groupName = groupNameInput.value;
    const dataId = dataIdInput.value;
    chrome.storage.sync.set({ appId, appSecret,groupBy, groupName, dataId }, () => {
      alert('Settings saved!');
    });
  });
});